﻿@model Tarasca.Models.EditarMovimientoModel
@using BLLTarasca
<script type="text/javascript">
    var valorIdCategoria = @(Html.Raw(Model.IdCategoria));
    var valorIdMedioDePago = @(Html.Raw(Model.IdMedioDePago));
    var valorFecha = '@(Html.Raw(Model.Fecha))';

    $(document).ready(function () {
        var separadorMiles = "@Html.Raw(System.Threading.Thread.CurrentThread.CurrentCulture.NumberFormat.NumberGroupSeparator)";
        var separadorDecimal = "@Html.Raw(System.Threading.Thread.CurrentThread.CurrentCulture.NumberFormat.CurrencyDecimalSeparator)";

        $("#monto").autoNumeric('init', { aSep: separadorMiles, aDec: separadorDecimal, mDec: '2', vMin: '0', vMax: '1000000000' });

        EventBinder($("#btnCancelarEditarMovimiento"), "click", mostrarMovimientos);
        EventBinder($("#btnCargarNuevoMovimiento"), "click", guardarMovimiento);
        EventBinder($("#btnEditarCategorias"), "click", irACategorias);
        $('#dtpFecha').datepicker();
        $('#dtpFecha').datepicker("option", "dateFormat", "dd/mm/yy");

        $("#categoriasLista").val(valorIdCategoria);
        $("#mediosDePagoLista").val(valorIdMedioDePago);
        $("#dtpFecha").datepicker("setDate", valorFecha );
    });

    function guardarMovimiento() {
        if (validarMovimientoDatos()) {
            var monto = $("#monto").autoNumeric("get");
            var esIngreso = $("#rdoEsIngreso").is(":checked");
            var idCategoria = $("#categoriasLista").val();
            var idMedioDePago = $("#mediosDePagoLista").val();
            var fecha = $("#dtpFecha").val();
            var descripcion = $("#descripcion").val();
            var idMovimiento = '@Html.Raw(Model.IdMovimiento.ToString())';

            mostrarCargandoCuentas();
            $.ajax({
                url: '@Url.Content("~/Movimientos/Guardar")',
                data: { monto: monto, esIngreso: esIngreso, idCategoria: idCategoria, idMedioDePago: idMedioDePago, fecha: fecha, descripcion: descripcion, idMovimiento: idMovimiento },
                success: function (data) {
                    ocultarCargandoCuentas();
                    mostrarMovimientos();
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    ocultarCargandoCuentas();

                    if(idMovimiento > 0)
                        mostrarMensajeGlobalError("Guardar Movimiento");
                    else
                        mostrarMensajeGlobalError("Nuevo Movimiento");
                }
            });
        }
    }

    function validarMovimientoDatos() {
        var todoBien = true;

        var valorMonto = $("#monto").val();
        if (valorMonto.length == 0) {
            $("#monto").parent().addClass("has-error");
            $("#monto").parent().removeClass("has-success");
            todoBien = false;
        }
        else {
            $("#monto").parent().removeClass("has-error");
            $("#monto").parent().addClass("has-success");
        }

        var valorFecha = $("#dtpFecha").val();
        if (valorMonto.length == 0) {
            $("#dtpFecha").parent().addClass("has-error");
            $("#dtpFecha").parent().removeClass("has-success");
            todoBien = false;
        }
        else {
            $("#dtpFecha").parent().removeClass("has-error");
            $("#dtpFecha").parent().addClass("has-success");
        }

        return todoBien;
    }

    function irACategorias(){
        mostrarCategorias();
        mostrarVolverUltimoMovimiento();
    }

    function refrescarCategorias(){
        mostrarCargandoCuentas();

        $.ajax({
            url:'@Url.Content("~/Categorias/MostrarCombo")',
            data: { idCuenta: @Html.Raw(Model.IdCuenta) },
            success: function (data) {
                ocultarCargandoCuentas();
                $("#contenedorCategorias").html(data);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                ocultarCargandoCuentas();
                mostrarMensajeGlobalError("Refrescando Categorías");
            }
        });
    }
</script>
@if (Model.IdMovimiento > 0)
{
    <h1>Editar movimiento</h1>
}
else
{
    <h1>Nuevo movimiento</h1>
}
<div class="form-horizontal contenedorEditarMovimiento">
    <div class="form-group">
        <label class="col-md-2 control-label">Monto:</label>
        <div class="col-md-4">
            @if (Model.Monto.HasValue)
            {
                <input type="text" id="monto" class="form-control columnaDinero" value="@Model.Monto.Value.ToString("C2")" />
            }
            else
            {
                <input type="text" id="monto" class="form-control columnaDinero" value="" />
            }
            
        </div>
    </div>
    <div class="form-group">
        <label class="col-md-2 control-label">Tipo:</label>
        <div id="labelPaIzquierda" class="col-md-2 control-label">
            @if (Model.EsIngreso)
            {
                <input id="rdoEsIngreso" type="radio" name="EsIngreso" checked="checked" />
            }
            else
            {
                <input id="rdoEsIngreso" type="radio" name="EsIngreso" />
            }
            <label>Ingreso</label>
        </div>
        <div id="labelPaIzquierda" class="col-md-2 control-label">
            @if (Model.EsIngreso)
            {
                <input id="rdoEsGasto" type="radio" name="EsIngreso" />
            }
            else
            {
                <input id="rdoEsGasto" type="radio" name="EsIngreso" checked="checked" />
            }
            <label>Gasto</label>
        </div>
    </div>
    <div class="form-group">
        <label class="col-md-2 control-label">Categoría:</label>
        <div id="contenedorCategorias" class="col-md-4">
            <select id="categoriasLista" class="form-control">
                @foreach (TA_Categoria categoria in Model.Categorias)
                {
                    <option value="@categoria.IdCategoria">@categoria.Nombre</option>                    
                }
            </select>
        </div>
        <div class="col-md-2">
            <button id="btnEditarCategorias" class="btn btn-sm btn-info">Editar Categorías</button>
        </div>
    </div>
    <div class="form-group">
        <label class="col-md-2 control-label">Medio de pago:</label>
        <div class="col-md-4">
            <select id="mediosDePagoLista" class="form-control">
                @foreach (TA_MedioDePago medio in Model.MediosDePago)
                {
                    <option value="@medio.IdMedioDePago">@medio.Nombre</option>
                }
            </select>
        </div>
    </div>
    <div class="form-group">
        <label class="col-md-2 control-label">Fecha:</label>
        <div class="col-md-4">
            <div class='input-group date'>
                <input id='dtpFecha' type='text' class="form-control" />
                <span class="input-group-addon">
                    <span class="glyphicon glyphicon-calendar"></span>
                </span>
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="col-md-2 control-label">Descripción:</label>
        <div class="col-md-4">
            <input id="descripcion" type="text" class="form-control" value="@Model.Descripcion" />
        </div>
    </div>
    <div class="form-group">
        <div class="col-md-offset-2 col-md-4">
            <button id="btnCargarNuevoMovimiento" class="btn btn-success">Guardar</button>
            <button id="btnCancelarEditarMovimiento" class=" btn btn-danger">Cancelar</button>
        </div>
    </div>
</div>